{extend name="base" /}
<!-- page specific plugin styles -->
{block name="plugin-styles"}{/block}
<!-- inline styles related to this page -->
{block name="inline-styles"}{/block}
<!-- breadcrumb -->
{block name="breadcrumbs"}
<ul class="breadcrumb">
    <li>
        <i class="ace-icon fa fa-home home-icon"></i>
        <a href="{:url('Index/index')}">首页</a>
    </li>
    <li class="active">商品管理</li>
</ul>
<!-- /.breadcrumb -->
{/block}
<!-- PAGE CONTENT BEGINS -->
{block name="content"}
<div class="page-header">
    <h1>
		商品分类
	</h1>
</div>
<!-- /.page-header -->
<div class="clearfix tableTools-container">
    <div class="pull-right">
        <a href="{:url('goods_classify/add')}" class="btn btn-xs btn-primary">新增</a>
    </div>
</div>
<div class="table-responsive">
	<table class="table table-bordered" id="DynamicTable"></table>
</div>
<!-- /.table-responsive -->
{/block}
<!-- PAGE CONTENT ENDS -->
<!-- page specific plugin scripts -->
{block name="plugin-scripts"}
<script src="/static/ace/assets/js/jquery.dataTables.min.js"></script>
<script src="/static/ace/assets/js/jquery.dataTables.bootstrap.min.js"></script>
{/block}
<!-- inline scripts related to this page -->
{block name="related-scripts"}
<script type="text/javascript">
    var myTable
	jQuery(function($) {
		myTable = 
		$('#DynamicTable')
		.wrap("<div class='dataTables_borderWrap' />")   //if you are applying horizontal scrolling (sScrollX)
		.DataTable({
			"autoWidth": false,	//智能列宽处理
			"deferRender": true,	//延迟渲染以获得额外的初始化速度
			"info": true,	//表信息显示
			"lengthChange": false,	//更改每页记录数
			"ordering": false,	//排序功能
			"paging": true,	//启用或禁用表分页
			"processing": false,	//处理指标
			// "scrollX": false,	//水平滚动
			// "scrollY": false,	//垂直滚动
			"searching": false,	//搜索功能
			"serverSide": true,	//服务器端处理模式
			"stateSave": true,	//状态保存(页面重新加载时恢复表状态)
			"language": {
                "url": "//cdn.datatables.net/plug-ins/1.10.19/i18n/Chinese.json"
            },
			"ajax": {
                "url": "/admin/goods_classify/rs",
                "type": "GET",
                "data": function (d) {
                    // d.goodsname = $("input[name=goodsname]").val();
                    // d.catid = $("select[name=catid]").val();
                    // d.isshow = $("select[name=isshow]").val();
                },
                "dataSrc": function (json) {
                    return json.data;
                }
            },
            "columns": [{
                "title": "ID",
                "data": "id"
            }, {
                "title": "名称",
                "data": "catname"
            }, {
                "title": "类型",
                "data": "type"
            }, {
                "title": "状态",
                "data": "isshow"
            }, {
                "title": "操作",
                "data": "id"
            }],
            "columnDefs": [{
            	"className": "text-center",
            	"targets": [0,2,3,4]
            }, {
                "render": function (data, type, row, meta) {
                    if(data==1){
                        return "上架"
                    }else if(data==2){
                        return "未上架"
                    }
                },
                "targets": 3
            }, {
            	"render": function (data, type, row, meta) {
            		
            		var add = ''
                        if(row.isshow == 2){
                            add ='<a href="#" class="btn btn-xs btn-danger" data-rel="tooltip" title="上线" onclick="online('+data+')">\
                            <i class="ace-icon fa fa-check-circle bigger-120"></i>\
                            </a>'
                        }else{
                            add = '<a href="#" class="btn btn-xs btn-danger" data-rel="tooltip" title="下线" onclick="offline('+data+')">\
                            <i class="ace-icon fa fa-times bigger-120"></i>\
                            </a>';
                        }
                    return '<div class="btn-group">'
                    + add+
						'<a href="{:url('goods_classify/edit')}?id='+data+'" class="btn btn-xs btn-primary" data-rel="tooltip" title="编辑">\
							<i class="ace-icon fa fa-pencil bigger-120"></i>\
						</a>\
					</div>';
                },
                "targets": 4
            }],
            "initComplete": function( settings, json ) {
            	$("#DynamicTable").prev(".row").remove();
            	//add tooltip for small view
				$('[data-rel="tooltip"]').tooltip();
			}
		});
	});
	
	function online(_id){
		update(_id,1)
	}
	
	function offline(_id){
		update(_id,2)
	}
	
	function update(_id,status){
		$.ajax({
            url: '/admin/goods_classify/update',
            type: 'POST',
            dataType: 'json',
            data: {id: _id,isshow:status},
        })
        .done(function(json) {
            console.log("success");
            if(json.returnCode==1){
                alert(json.returnMsg);
                myTable.draw();
            }else{
                alert(json.returnMsg);
            }
        })
	}
</script>
{/block}